<template>
  <div>
    <div title="张三">韩</div>
    <div>你好</div>
    <div :title="'张三'">helle word</div>
    <div :title="getName('张三')">helle word</div>
    <div @change="add('李四')">张，三，</div>
    <div :title="`${a}张三` + getName('张三')">哈哈</div>
    <div :title2="`${a}张三${getName('邓七')}` + b">张三a</div>
    <div
      :title="`${a}张三` + getName('张三')"
      :title2="`${a}张三${getName('邓七')}` + b"
    >
      张三a
    </div>
    <div v-if="b === '王五'">哈哈{{ add("李四") }}哈哈</div>
    <div>hello 哈哈{{ add("李四a") }}</div>
    <div>
      王 五
      <span>李四</span>
    </div>
  </div>
</template>

<script>
export default {
  name: "string-demo",
  props: {
    title: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      c: {
        d: {
          e: "赵六",
        },
      },
      a: "1",
      b: "王五",
    };
  },
  methods: {
    getName(name) {
      return name;
    },

    // 这里可以添加方法
    add() {
      const e = {
        f: "王五",
        g: "赵六",
        h: "王五",
        i: "王五",
        j: "王五",
        k: "王五",
        l: "王五",
        m: "王五",
        n: "王五",
        o: "王五",
        p: "王五",
        q: "王五",
        r: "王五",
        s: "王五",
      };
      this.a += "赵六" + this.b;
    },
  },
  created() {
    this.a = "张三";
    // 这里可以添加方法
    this.add();
  },
};
</script>
